import React, { useEffect, useState } from 'react';

import PropTypes from 'prop-types';

function parseTime(time) {
    return time > 9 ? time : `0${time}`
}

const Timer = (props) => {
    // const [time, setTime] = useState(props.time ? 0 : props.time);
    const { time, setTime } = props
    useEffect(() => {
        const Timer = setInterval(() => {
            setTime(time => time + 1)
        }, 1000);
        return () => {
            clearInterval(Timer)
        }
    }, [])
    let hour = parseTime(parseInt(time / (60 * 60))) || '00';
    let minute = parseTime(parseInt(time / 60)) || '00';
    let second = parseTime(parseInt(time % 60)) || '00';
    return (
        <div className='timer'>
            {`${hour}:${minute}:${second}`}
        </div>
    );
}
Timer.propTypes = {
    time: PropTypes.number.isRequired,
    setTime: PropTypes.func.isRequired,
}

export default Timer;
